import React, { Component } from 'react';
import { Container } from './style2'
import { Table } from 'antd';

//组件样式
import 'antd/dist/antd.css'

const columns = [
    {
      title: '序号',
      dataIndex: 'name',
      key: 'name',
      align: 'center',
    },
    {
      title: '物品名称',
      dataIndex: 'age',
      key: 'age',
      align: 'center',
    },
    {
      title: '物品编码',
      dataIndex: 'address',
      key: 'address',
      align: 'center',
    },
    {
      title: '物品分类',
      key: 'tags',
      dataIndex: 'tags',
      align: 'center',
    },
    {
      title: '品牌',
      key: 'action',
      dataIndex: 'action',
      align: 'center',
    },
    {
        title: '规格/型号',
        key: 'size',
        dataIndex: 'size',
        align: 'center',
    },
    {
        title: '单位',
        key: 'danwei',
        dataIndex: 'danwei',
        align: 'center',
    },
    {
        title: '数量',
        key: 'num',
        dataIndex: 'num',
        align: 'center',
    },
  ];
  
  const data = [
    {
      key: '1',
      name: '1',
      age: '5号电池',
      address: 'xm5hdc',
      tags: '办公用品',
      action:'南孚',
      size:'',
      danwei:'节',
      num:2
    },
    {
      key: '1',
      name: '合计',
      age: '',
      address: '',
      tags: '',
      action:'',
      size:'',
      danwei:'',
      num:3
    },
  ];

class alert extends Component {
    render() {
        return (
            <Container >
                <div className="demo-title">
                    <p>申领单号：</p><span>SL20201225001 </span>
                    <p>申领日期：</p><span>2020-12-25</span>
                    <p>申领人：</p><span>熊朝丹</span>
                    <p>申领部分：</p><span>教务处</span>
                    <p>部门审核人：</p><span>陈张婷</span>
                    <p>领用类型：</p><span>个人领用</span>
                </div>
                <div className="table"><Table columns={columns} dataSource={data} bordered size={'small'} pagination={false}/></div>
                <div>申领原因：个人办公用</div>
                <div>*部门审核状态：<input type="radio" name="pass"/>通过 <input type="radio" name="pass"/>不通过</div>
                <div>部门审核意见：</div>
                <textarea name="" id="" cols="20" rows="5"></textarea>
            </Container>
        );
    }
}

export default alert;
